<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>组织管理/明细页面</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="${ctx}/layui/css/layui.css" media="all"/>
    <link rel="stylesheet" href="${ctx}/qbdmsStatic/iconfont/iconfont.css"/>
    <link rel="stylesheet" href="${ctx}/qbdmsStatic/style/qbdms.css">
    <script type="text/javascript">
        var __ctx = "${ctx}";
    </script>
    <style>
        .layui-tab-brief>.layui-tab-title .layui-this{color: #2682FF}
        .layui-tab-brief>.layui-tab-title .layui-this:after{border-color: #2682FF}
        .table-detail{color:#606266 }
    </style>
</head>
<body style="padding:0 16px 0px 16px ">
    <div class="layui-fluid" style="padding: 0; position: relative;height: 100%">
        <div class="layui-row" style="overflow: auto;position: absolute;bottom: 58px;top: 0;left:0;right:0">
            <div class="layui-tab layui-tab-brief">
                <ul class="layui-tab-title">
                    <li class="layui-this">基本信息</li>
                    <li>所属组织</li>
                    <li>所属角色</li>
                </ul>
                <div class="layui-tab-content">
                    <div class="layui-tab-item layui-show">
                        <table class="table-detail" style="margin: 0 auto">
                            <tr>
                                <td rowspan="10" style="width:32%;padding-left:0">
                                    <div style="margin-top:10px;text-align:center">
                                        <img src="<#if (picture!='' && picture!=null)>${picture}<#else>${ctx}/systemStatic/style/res/male.jpg</#if>" alt="加载失败" style="width:270px;height: 380px" class="imgShow">
                                    </div>
                                </td>
                                <th style="width:20%;border-bottom:none;border-right:none;padding-left: 32px ">账号:</span></th>
                                <td  name="account" style="border-bottom:none;"></td>
                            </tr>
                            <tr>
                                <th style="border-bottom:none;border-right:none;padding-left: 32px ">用户姓名:</span></th>
                                <td name="fullName" style="border-bottom:none;"></td>
                            </tr>
                            <tr>
                                <th style="border-bottom:none;border-right:none; padding-left: 32px">用户性别:</th>
                                <td name="sex" style="border-bottom:none;"></td>
                            </tr>
                            <tr>
                                <th style="border-bottom:none;border-right:none;padding-left: 32px ">身份证号:</th>
                                <td name="idCard" style="border-bottom:none;"></td>
                            </tr>
                            <tr>
                                <th style="border-bottom:none;border-right:none;padding-left: 32px ">入职时间:</th>
                                <td name="entryDate" style="border-bottom:none;"></td>
                            </tr>
                            <tr>
                                <th style="border-bottom:none;border-right:none; padding-left: 32px">员工状态:</th>
                                <td name="userStatus" style="border-bottom:none;"></td>
                            </tr>
                            <tr>
                                <th style="border-bottom:none;border-right:none;padding-left: 32px ">邮箱地址:</th>
                                <td name="email" style="border-bottom:none;"></td>
                            </tr>
                            <tr>
                                <th style="border-bottom:none;border-right:none; padding-left: 32px">手机:</th>
                                <td name="mobile" style="border-bottom:none;"></td>
                            </tr>
                            <tr>
                                <th style="border-bottom:none;border-right:none; padding-left: 32px">电话:</th>
                                <td name="phone" style="border-bottom:none;"></td>
                            </tr>
                        </table>
                    </div>
                    <div class="layui-tab-item orgSleView" style="padding:0">
                        <table id="orgToBelongs" lay-filter="orgToBelongs"></table>
                    </div>
                    <div class="layui-tab-item">
                        <table id="userRoleOwned" lay-filter="userRoleOwned"></table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="layui-form-item layui-btn-container">
        <div class="layui-input-block" style="width: 100%; text-align: center;position: absolute; bottom: 0px; margin: 0;">
            <a  class="layui-btn layui-btn-sm canUserView fillBtn">关闭</a>
        </div>
    </div>
    <script src="${ctx}/qbdmsStatic/public/configFile.js"></script>
    <script src="${ctx}/layui/layui.js"></script>

    <script>
        layui.config({
            base: serverPath.qbdmsPath + staticPath.qbdmsPath //静态资源所在路径
        }).extend({
            index: 'lib/index' //主入口模块
        }).use(['index','table','setter','publicMethods','util','jquery'], function () {
             var table = layui.table, publicMethods=layui.publicMethods,setter=layui.setter,util=layui.util,$=layui.jquery;
             var userId = '${userId}';//获取id
             var t_date = {};
             t_date.userId = userId;
             table.render({//所属组织
                elem: '#orgToBelongs',
                title: '所属组织',
                height: 'full-160',
                url: serverPath.qbdmsPath +setter.sysLinkPath+ 'userPosition/queryByUserIdOrPosId', //数据接口
                // page: true, //开启分页
                method: 'get',
                where: {
                    userId:userId,
                    posId:""
                },
                cols: [
                    [
                        {field: 'userPosId', title: 'ID', sort: true, hide: true},
                        {field: 'orgName', title: '组织名称'},
                        {field: 'isPrimary', title: '是否主组织', templet:function (d) {if (d.isPrimary == 0) {return '否';}return '是';}},
                        {field: 'isCharge', title: '主要负责人', templet:function (d) {if (d.isCharge == 0) {return '否';}return '是';}},
                    ]
                ],
            });

            table.render({//所属角色
                elem: '#userRoleOwned',
                title: '所属角色',
                height: 'full-160',
                url: serverPath.qbdmsPath +setter.sysLinkPath +'sysRole/queryByUserId', //数据接口
                // page: true, //开启分页
                method: 'get',
                where: {
                    userId:userId
                },
                cols: [
                    [ //表头
                        {field: 'roleId',title: 'ID',sort: true, hide: true},
                        {field: 'roleName', title: '角色名称'},
                        {field: 'systemName', title: '子系统名称'}
                    ]
                ],
            });

            $.ajax({
            url: serverPath.qbdmsPath + setter.sysLinkPath+"sysUser/get",
            type: "get",
            contentType: 'application/json',
            dataType: 'json',
            data:t_date,
            success: function (data) {
                // 表单初始赋值
                if(publicMethods._filterRecord(data)){
                    var returnDate = data.data;
                    var time = util.toDateString(returnDate.entryDate,'yyyy-MM-dd');
                    $("[name='account']").html("<input style='display: inline-block;width: 220px;height: 30px; background: rgba(246,249,255,1); line-height: 30px;margin:0;border:none;disabled:disabled' value="+returnDate.account+">" );
                    $("[name='password']").html("<label style='display: inline-block;width: 220px;height: 30px; background:  rgba(246,249,255,1); line-height: 30px;'>" + returnDate.password + "</label>");
                    $("[name='entryDate']").html("<label style='display: inline-block;width: 220px;height: 30px; background: rgba(246,249,255,1); line-height: 30px;'>" + time + "</label>");
                    $("[name='idCard']").html("<label style='display: inline-block;width: 220px;height: 30px; background:  rgba(246,249,255,1); line-height: 30px;'>" + returnDate.idCard + "</label>");
                    $("[name='fullName']").html("<input style='display: inline-block;width: 220px;height: 30px; background: rgba(246,249,255,1); line-height: 30px;margin:0;border:none;disabled:disabled' value="+returnDate.fullName+">" );
                    $("[name='sex']").html("<label style='display: inline-block;width: 220px;height: 30px; background:  rgba(246,249,255,1); line-height: 30px;'>" + (returnDate.sex == '0' ? '女' : '男')  + "</label>");
                    var userStatus = returnDate.userStatus;
                    if (userStatus === '0') {
                        userStatus = "正式员工";
                    } else if (userStatus === '1') {
                        userStatus = "试用员工";
                    } else if (userStatus === '2') {
                        userStatus = "停薪留职";
                    } else if (userStatus === '3') {
                        userStatus = "返聘";
                    } else if (userStatus === '4') {
                        userStatus = "中转";
                    }else if (userStatus === '5') {
                        userStatus = "离职";
                    }
                    $("[name='userStatus']").html("<label style='display: inline-block;width: 220px;height: 30px; background:  rgba(246,249,255,1); line-height: 30px;'>" + userStatus + "</label>");
                    $("[name='email']").html("<label style='display: inline-block;width: 220px;height: 30px; background:  rgba(246,249,255,1); line-height: 30px;'>" + returnDate.email + "</label>");
                    $("[name='mobile']").html("<label style='display: inline-block;width: 220px;height: 30px; background:  rgba(246,249,255,1); line-height: 30px;'>" + returnDate.mobile + "</label>");
                    $("[name='phone']").html("<label style='display: inline-block;width: 220px;height: 30px; background:  rgba(246,249,255,1); line-height: 30px;'>" + returnDate.phone + "</label>");
                }else{
                   layer.alert(data.msg);
                }
            },
            error: function(XMLHttpRequest, textStatus, errorThrown) {
                layer.alert("暂无数据，请稍后操作！" + XMLHttpRequest.status);
            }
        });

            $(".canUserView").click(function () {
                parent.layer.close(parent.layer.getFrameIndex(window.name));
            })
         })
    </script>
</body>
</html>
